<!doctype html>
{% extends "base.html" %}
{% block title %}资产列表{% endblock title %}

{% block page0_show %}show{% endblock page0_show %}
{% block page0.2_active %}active{% endblock page0.2_active %}

{% block main_content %}
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <h5 class="card-title">主机列表</h5>
                <h6 style="color: indianred;"> {{ hosterror }} </h6>
                <h6 class="card-subtitle text-muted">从数据库中获取已有的主机</h6>
            </div>
            <table class="table table-striped table-hover table-bordered">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>主机可视名</th>
                        <th>主机名</th>
                        <th>主机IP</th>
                        <th>SSH端口</th>
                        <th>主机类型</th>
                        <th>备注</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    {% for host in HostList %}
                    <tr>
                        <td>{{ host.id }}</td>
                        <td>{{ host.visiblename }}</td>
                        <td>{{ host.hostname }}</td>
                        <td>{{ host.ip }}</td>
                        <td>{{ host.ssh_port }}</td>
                        <td>{{ host.type }}</td>
                        <td>{{ host.description }}</td>
                        <td class="table-action" style="width: 10%;">
                            <a href="" style="margin-right: 10px;"  data-toggle="modal" data-target="#set{{ host.id }}"><i class="fe fe-edit-2"></i></a>
                            <div class="modal fade" id="set{{ host.id }}" tabindex="-1" role="dialog" aria-hidden="true">
                                <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <h1 class="modal-title">修改主机：{{ host.visiblename }}</h1>
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                        </div>
                                        <div class="modal-body m-3">
                                            <form method="post" action="/hostmanager">
                                                <div class="form-group row">
                                                    <label class="col-form-label col-sm-2 text-sm-right">ID(仅可看)</label>
                                                    <div class="col-sm-10">
                                                        <input type="number" name="id" class="form-control" readonly="readonly" value="{{ host.id }}">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label class="col-form-label col-sm-2 text-sm-right">主机名</label>
                                                    <div class="col-sm-10">
                                                        <input type="text" name="hostname" value="{{ host.hostname }}" class="form-control {{ hostname_error }}" required="" placeholder="唯一主机名，不应有特殊字符和空格">
                                                        <div class="invalid-feedback">
                                                            主机名已存在
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label class="col-form-label col-sm-2 text-sm-right">可视名称</label>
                                                    <div class="col-sm-10">
                                                        <input type="text" name="visiblename" value="{{ host.visiblename }}" class="form-control" required="" placeholder="外部看到的名称，可以是任何名称">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label class="col-form-label col-sm-2 text-sm-right">主机ip</label>
                                                    <div class="col-sm-10">
                                                        <input type="text" name="ip" value="{{ host.ip }}" class="form-control" required="" placeholder="主机IP">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label class="col-form-label col-sm-2 text-sm-right">用户名</label>
                                                    <div class="col-sm-10">
                                                        <input type="text" name="Suser" class="form-control" placeholder="留空则不修改">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label class="col-form-label col-sm-2 text-sm-right">密码</label>
                                                    <div class="col-sm-10">
                                                        <input type="password" name="Spasswd" autocomplete='new-password' class="form-control" placeholder="留空则不修改">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label class="col-form-label col-sm-2 text-sm-right">SSH端口</label>
                                                    <div class="col-sm-10">
                                                        <input type="number" name="ssh_port" class="form-control" required="" value="{{ host.ssh_port }}">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label class="col-form-label col-sm-2 text-sm-right">备注</label>
                                                    <div class="col-sm-10">
                                                        <textarea class="form-control" name="description" rows="3">{{ host.description }}</textarea>
                                                    </div>
                                                </div>
                                                <fieldset class="form-group">
                                                    <div class="row">
                                                        <label class="col-form-label col-sm-2 text-sm-right pt-sm-0">系统版本</label>
                                                        <div class="col-sm-10">
                                                            <select class="custom-select mb-3" name="Centos">
                                                                <option selected value="{{ host.type }}">当前版本:{{ host.type }}</option>
                                                                <option value="7">7</option>
                                                                <option value="6">6</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                </fieldset>
										        <div class="modal-footer">
                                                    <div class="col-sm-10 ml-sm-auto">
                                                        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
                                                        <button type="submit" class="btn btn-primary float-right" >修改</button>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <a href="" data-toggle="modal" data-target="#del{{ host.id }}"><i class="fe fe-trash"></i></a>
                            <div class="modal fade" id="del{{ host.id }}" tabindex="-1" role="dialog" aria-hidden="true">
								<div class="modal-dialog modal-dialog-centered" role="document">
									<div class="modal-content">
										<div class="modal-header">
											<h1 class="modal-title">是否删除 {{ host.visiblename }}</h1>
											<button type="button" class="close" data-dismiss="modal" aria-label="Close">
							                    <span aria-hidden="true">&times;</span>
							                  </button>
										</div>
                                        <form method="post" action="/HostDel">
										<div class="modal-body m-3">
                                            <div class="form-group row">
                                                <label class="col-form-label col-sm-4 text-sm-right">将删除的主机ID</label>
                                                <div class="col-sm-8">
                                                    <input type="number" name="id" class="form-control" readonly="readonly" value="{{ host.id }}">
                                                </div>
                                            </div>
                                            <div class="form-group row">
                                                <label class="col-form-label col-sm-4 text-sm-right">将删除主机名</label>
                                                <div class="col-sm-8">
                                                    <input type="text" name="hostname" value="{{ host.hostname }}" readonly="readonly"  class="form-control">
                                                </div>
                                            </div>
											<p class="mb-0">删除后无法恢复，请慎重，点击 弹窗外/X按钮/取消按钮 可取消</p>
										</div>
										<div class="modal-footer">
											<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
											<button type="submit" class="btn btn-danger">删除</button>
										</div>
                                        </form>
									</div>
								</div>
							</div>
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock main_content %}

{% block script %}
{% endblock script %}